<template>
  <dtDialog
    :title="textMap[dialogStatus]"
    :visible.sync="dialogFormVisible"
    :is-loading="loading"
    @closeDialog="resetTemp"
    @comfirmBtn="submitData"
  >
    <!-- <el-form
      ref="dataForm"
      slot="content"
      :rules="rules"
      :model="temp"
      label-position="right"
      label-width="82px"
      style="width: 100%"
    >
      <el-form-item label="岗位名称" prop="positionName">
        <el-input v-model.trim="temp.positionName" maxlength="30" show-word-limit class="limit" />
      </el-form-item>
      <el-form-item label="岗位编码" prop="positionCode">
        <el-input v-model.trim="temp.positionCode" :disabled="dialogStatus === 'update'" maxlength="30" show-word-limit class="limit" />
      </el-form-item>
      <el-form-item label="顺序" prop="positionSort">
        <el-input v-model.trim="temp.positionSort" min="0" :oninput="initPositiveInteger(8)" maxlength="8" show-word-limit class="limit" />
      </el-form-item>
      <el-form-item label="备注" prop="positionRemark">
        <el-input v-model.trim="temp.positionRemark" show-word-limit maxlength="200" type="textarea" class="limit" />
      </el-form-item>
    </el-form> -->
    <DtForm
      slot="content"
      :form-opts="config"
      :width-size="1"
      :ref-obj.sync="config.ref"
    />
  </dtDialog>
</template>
<script>
import { positiveInteger, checkParameterName, checkSpecialStr } from '@/framework/utils/validate'
import hrPositionApi from '@/framework/api/userCenter/hrPosition'

export default {
  components: {
  },
  dicts: ['SecondaryAuthWay'],
  data() {
    const validatePositionCode = (rule, value, callback) => {
      if (!value) {
        callback(new Error('请输入岗位编码'))
      } else if (!checkParameterName(value)) {
        callback(new Error('请输入字母或数字'))
      } else callback()
    }
    const validatePositionName = (rule, value, callback) => {
      if (!value) {
        callback(new Error('请输入岗位名称'))
      } else if (!checkSpecialStr(value)) {
        callback(new Error('不要输入特殊字符'))
      } else callback()
    }
    const validatePositionRemark = (rule, value, callback) => {
      if (!checkSpecialStr(value) && value) {
        callback(new Error('不要输入特殊字符'))
      } else callback()
    }
    return {
      textMap: {
        update: '修改岗位',
        create: '新增岗位'
      },
      dialogStatus: '',
      dialogFormVisible: false,
      config: {
        ref: null,
        labelWidth: '82px',
        formData: {
          positionName: '',
          positionCode: '',
          positionSort: '',
          positionRemark: ''
          // positionSort1: []
        },
        columns: [
          {
            prop: 'positionName',
            component: 'el-input',
            label: '岗位名称',
            maxlength: 10,
            type: 'text'
          },
          {
            prop: 'positionCode',
            component: 'el-input',
            label: '岗位编码',
            bind: {
              disabled: this.dialogStatus === 'update'
            },
            type: 'text'
          },
          {
            prop: 'positionSort',
            component: 'el-input',
            label: '排序',
            maxlength: 8,
            bind: {
              min: 0,
              oninput: positiveInteger(8)
            },
            listeners: {

            },
            type: 'text'
          },
          // {
          //   prop: 'positionSort1',
          //   component: 'el-select',
          //   label: '分类',
          //   list: 'positionSort1List'
          // },
          {
            prop: 'positionRemark',
            component: 'el-input',
            type: 'textarea',
            widthSize: 1,
            label: '备注',
            maxlength: 200
          }

        ],
        rules: {
          positionName: [{ required: true, trigger: 'change', validator: validatePositionName }],
          positionCode: [{ required: true, trigger: 'change', validator: validatePositionCode }],
          positionSort: [{ required: true, message: '请输入排序', trigger: 'change' }],
          positionRemark: [{ required: false, validator: validatePositionRemark }]
        },
        listTypeInfo: {
          positionSort1List: () => { return this.dict.type.SecondaryAuthWay }

        }
      },
      temp: {

      },
      loading: false
    }
  },
  methods: {
    openDialog(row, type) {
      this.resetTemp()
      this.dialogFormVisible = true
      if (type == 'create') {
        this.dialogStatus = 'create'
      } else {
        this.dialogStatus = 'update'
        hrPositionApi.detail(row.positionId).then((res) => {
          this.config.formData = res.data
        })
      }
    },
    resetTemp() {
      // 重置form表单
      Object.assign(
        this.$data.config.formData,
        this.$options.data().config.formData
      )
      this.config.formData = {}
      this.config.ref?.resetFields()
    },
    submitData() {
      this.config.ref.validate((valid) => {
        if (valid) {
          this.loading = true
          this.updateData()
        }
      })
    },
    async updateData() {
      try {
        if (this.dialogStatus == 'create') {
          await hrPositionApi.add(this.config.formData)
        } else {
          await hrPositionApi.edit(this.config.formData)
        }
        this.$dtMessage({
          title: '成功',
          message: this.dialogStatus == 'create' ? '新增成功' : '修改成功',
          type: 'success',
          duration: 2000
        })
        this.$parent.getList()
        this.dialogFormVisible = false
        this.loading = false
      } catch (error) {
        this.loading = false
      }
    }
  }
}
</script>
